<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%@ taglib prefix="sec"
	uri="http://www.springframework.org/security/tags"%>
<%@ taglib prefix="s" uri="/struts-tags"%>
<%@ taglib prefix="huoyun" uri="/huoyun"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>我的用户中心</title>

<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
<link rel="stylesheet" type="text/css"
	href="${pageContext.request.contextPath}/theme/css/main.css">
<link rel="stylesheet" type="text/css"
	href="${pageContext.request.contextPath}/theme/css/style_userCenter.css">

<script type="text/javascript"
	src="${pageContext.request.contextPath}/theme/js/jquery-1.6.js"></script>

<style type="text/css">
.listTable {
	border: 1px solid #E8E8E8;
	width: 100%;
}

.listTable th {
	background-color: #F6F6F6;
	border-bottom: 1px solid #F1F1F1;
	line-height: 30px;
	padding-left: 10px;
	text-align: left;
}

.listTable td {
	border-bottom: 1px solid #F1F1F1;
	color: #595959;
	line-height: 28px;
	padding: 3px 10px;
	text-align: left;
}
</style>

<style type="text/css">
<!--
body {
	background: #fff;
	text-align: center;
	margin: 0 auto;
	padding: 0;
	font: 12px Arial;
	color: #000;
	line-height: 1.2em
}

div,form,img,ul,ol,li,dl,dt,dd {
	margin: 0;
	padding: 0;
	border: 0;
}

h1,h2,h3,h4,h5,h6 {
	margin: 0;
	padding: 0;
}

table,td,tr,th {
	font-size: 12px;
}

/* 星级评分 */
.shop-rating {
	height: 25px;
	overflow: hidden;
	zoom: 1;
	padding: 2px 0px;
	position: relative;
	z-index: 999;
}

.shop-rating span {
	height: 23px;
	display: block;
	line-height: 23px;
	float: left;
}

.shop-rating span.title {
	width: 125px;
	text-align: right;
	margin-right: 5px;
}

.shop-rating ul {
	float: left;
	margin: 0;
	padding: 0
}

.shop-rating .result {
	margin-left: 20px;
	padding-top: 2px;
}

.shop-rating .result span {
	color: #ff6d02;
}

.shop-rating .result em {
	color: #f60;
	font-family: arial;
	font-weight: bold;
}

.shop-rating .result strong {
	color: #666666;
	font-weight: normal;
}

.rating-level,.rating-level a {
	background: url(http://a.tbcdn.cn/app/rc/img/star_v2.png) no-repeat
		scroll 1000px 1000px;
}

.rating-level {
	background-position: 0px 0px;
	width: 120px;
	height: 23px;
	position: relative;
	z-index: 1000;
}

.rating-level li {
	display: inline;
}

.rating-level a {
	line-height: 23px;
	height: 23px;
	position: absolute;
	top: 0px;
	left: 0px;
	text-indent: -999em;
	*zoom: 1;
	outline: none;
}

.rating-level a.one-star {
	width: 20%;
	z-index: 6;
}

.rating-level a.two-stars {
	width: 40%;
	z-index: 5;
}

.rating-level a.three-stars {
	width: 60%;
	z-index: 4;
}

.rating-level a.four-stars {
	width: 80%;
	z-index: 3;
}

.rating-level a.five-stars {
	width: 100%;
	z-index: 2;
}

.rating-level .current-rating,.rating-level a:hover {
	background-position: 0 -28px;
}

.rating-level a.one-star:hover,.rating-level a.two-stars:hover,.rating-level a.one-star.current-rating,.rating-level a.two-stars.current-rating
	{
	background-position: 0 -116px;
}

.rating-level .three-stars .current-rating,.rating-level .four-stars .current-rating,.rating-level .five-stars .current-rating
	{
	background-position: 0 -28px;
}
-->
</style>

<style type="text/css">
#submit_button {
	width: 100px;
	height: 40px;
	background-image:
		url("${pageContext.request.contextPath}/theme/images/button_normal.png");
	background-size: 100% 100%;
	border: none;
	cursor: pointer;
	font-family: 宋体;
	font-size: 18px;
	font-style: normal;
	color: #fff;
	font-weight: bold;
	background-image:
		url("${pageContext.request.contextPath}/theme/images/button_normal_ie.png")
		\9;
}

#submit_button:hover,#submit_button.hover {
	background-image:
		url("${pageContext.request.contextPath}/theme/images/button_hover.png");
	background-image:
		url("${pageContext.request.contextPath}/theme/images/button_hover_ie.png")
		\9;
}

#submit_button:active,#submit_button.active {
	background-image:
		url("${pageContext.request.contextPath}/theme/images/button_down.png");
	background-image:
		url("${pageContext.request.contextPath}/theme/images/button_down_ie.png")
		\9;
}

.red {
	color: red;
}
</style>

</head>
<body>
	<div>
		<jsp:include page="../nav.jsp">
			<jsp:param value="nav_main" name="nav" />
		</jsp:include>
	</div>
	<div class="realCer">

		<!--主体部分-->
		<div class="realMain clearfix mt10">
			<!--左侧菜单-->
			<div class="realLeft" id="meunLeft">
				<jsp:include page="../leftMenu.jsp">
					<jsp:param value="con_nav_main" name="con_nav" />
				</jsp:include>
			</div>
			<!--中由-->
			<div class="realRight ml10">
				<div class="box">
					<div class="tit">运输服务评价</div>
					<div class="con">
						<table class="listTable">
							<tr>
								<th>下单时间</th>
								<th>订单号</th>
								<th>费用/保证金</th>
								<th>车牌号</th>
								<th>货物</th>
								<th>状态</th>
								<th>操作</th>
							</tr>
							<tr>
								<td><huoyun:dateFormat date="${orderObj.addTime}"
										dateFormat="yyyy-MM-dd HH:mm:ss" />
								</td>
								<td><s:property value="#orderObj.orderId" />
								</td>
								<td><s:property value="#orderObj.price" />
								</td>
								<td><s:property value="#orderObj.carNumber" />
								</td>
								<td><s:property value="#orderObj.cargisTitle" />
								</td>
								<s:if test="#orderObj.status == 1">
									<td>未缴纳保证金</td>
									<td><sec:authorize access="hasRole('ROLE_USER')">
											<a href="">缴纳保证金</a>
										</sec:authorize> <sec:authorize access="hasRole('ROLE_DRIVER')">
											<a href="">提醒货主</a>
										</sec:authorize> &nbsp;|&nbsp;<a href="">取消订单</a>
									</td>
								</s:if>
								<s:elseif test="#orderObj.status == 2">
									<td>未装货</td>
									<td><sec:authorize access="hasRole('ROLE_DRIVER')">
											<a href="">已经完成装货</a>
										</sec:authorize>
									</td>
								</s:elseif>
								<s:elseif test="#orderObj.status == 3">
									<td>货主未结清运费</td>
									<td><sec:authorize access="hasRole('ROLE_USER')">
											<a href="">结清运费</a>
										</sec:authorize> <sec:authorize access="hasRole('ROLE_DRIVER')">
											<a href="">提醒货主</a>
										</sec:authorize>
									</td>
								</s:elseif>
								<s:elseif test="#orderObj.status == 4">
									<td>等待卸货</td>
									<td><sec:authorize access="hasRole('ROLE_DRIVER')">
											<a href="">完成卸货</a>
										</sec:authorize>
									</td>
								</s:elseif>
								<s:elseif test="#orderObj.status == 5">
									<td>完成</td>
									<td></td>

								</s:elseif>
								<s:else>
									<td>异常终止</td>
									<td><a href="#">删除</a></td>
									<td></td>
								</s:else>
							</tr>
						</table>

						<form method="post" name="rateInfo"
							action="${pageContext.request.contextPath}/car/updateCarInfo.action?carId=<%=request.getParameter("id") %>">

							<table class="rateTable">
								<tr>
									<td>
										<div class="comment">
											<div class="textinput"
												style="border:solid 1px grey;  width:320;height:170">
												<span class="ph-label"></span>
												<textarea name="rateContents172887153184934" maxlength="500"
													aria-labelby="label-ti-172887153184934" class="rate-msg"
													style="width:300;height:150; border:0px; resize:none" ></textarea>
												<p class="text-counter">
													还可以输入<strong class="r-t-counter">50</strong>字
												</p>
											</div>
										</div>
									</td>

									<br>
									<br>
									<br>

									<td>
										<!-- # 星级评分 # star:value = 分数--> <s:if test="role='ROLE_USER'">
											<!-- 车主的星级评分 -->
											<div class="shop-rating">
												<span class="title">服务态度：</span>
												<ul class="rating-level" id="stars1">
													<li><a class="one-star" star:value="1" href="#">1</a>
													</li>
													<li><a class="two-stars" star:value="2" href="#">2</a>
													</li>
													<li><a class="three-stars" star:value="3" href="#">3</a>
													</li>
													<li><a class="four-stars" star:value="4" href="#">4</a>
													</li>
													<li><a class="five-stars" star:value="5" href="#">5</a>
													</li>
												</ul>
												<span class="result" id="stars1-tips"></span> <input
													type="hidden" id="stars1-input" name="a" value="" size="2" />
											</div>
											<div class="shop-rating">
												<span class="title">车源信息的准确性：</span>
												<ul class="rating-level" id="stars2">
													<li><a class="one-star" star:value="20" href="#">1</a>
													</li>
													<li><a class="two-stars" star:value="40" href="#">2</a>
													</li>
													<li><a class="three-stars" star:value="60" href="#">3</a>
													</li>
													<li><a class="four-stars" star:value="80" href="#">4</a>
													</li>
													<li><a class="five-stars" star:value="100" href="#">5</a>
													</li>
												</ul>
												<span class="result" id="stars2-tips"></span> <input
													type="hidden" id="stars2-input" name="b" value="" size="2" />
											</div>
											<div class="shop-rating">
												<span class="title">到达发货地的及时性：</span>
												<ul class="rating-level" id="stars3">
													<li><a class="one-star" star:value="20" href="#">1</a>
													</li>
													<li><a class="two-stars" star:value="40" href="#">2</a>
													</li>
													<li><a class="three-stars" star:value="60" href="#">3</a>
													</li>
													<li><a class="four-stars" star:value="80" href="#">4</a>
													</li>
													<li><a class="five-stars" star:value="100" href="#">5</a>
													</li>
												</ul>
												<span class="result" id="stars3-tips"></span> <input
													type="hidden" id="stars3-input" name="c" value="" size="2" />
											</div>
											<div class="shop-rating">
												<span class="title">到达收货地的及时性：</span>
												<ul class="rating-level" id="stars4">
													<li><a class="one-star" star:value="20" href="#">1</a>
													</li>
													<li><a class="two-stars" star:value="40" href="#">2</a>
													</li>
													<li><a class="three-stars" star:value="60" href="#">3</a>
													</li>
													<li><a class="four-stars" star:value="80" href="#">4</a>
													</li>
													<li><a class="five-stars" star:value="100" href="#">5</a>
													</li>
												</ul>
												<span class="result" id="stars4-tips"></span> <input
													type="hidden" id="stars4-input" name="d" value="" size="2" />
											</div>
											<div class="shop-rating">
												<span class="title">车辆及运输的安全性：</span>
												<ul class="rating-level" id="stars5">
													<li><a class="one-star" star:value="20" href="#">1</a>
													</li>
													<li><a class="two-stars" star:value="40" href="#">2</a>
													</li>
													<li><a class="three-stars" star:value="60" href="#">3</a>
													</li>
													<li><a class="four-stars" star:value="80" href="#">4</a>
													</li>
													<li><a class="five-stars" star:value="100" href="#">5</a>
													</li>
												</ul>
												<span class="result" id="stars5-tips"></span> <input
													type="hidden" id="stars5-input" name="e" value="" size="2" />
											</div>
											<div class="shop-rating">
												<span class="title">货物的完整性：</span>
												<ul class="rating-level" id="stars6">
													<li><a class="one-star" star:value="20" href="#">1</a>
													</li>
													<li><a class="two-stars" star:value="40" href="#">2</a>
													</li>
													<li><a class="three-stars" star:value="60" href="#">3</a>
													</li>
													<li><a class="four-stars" star:value="80" href="#">4</a>
													</li>
													<li><a class="five-stars" star:value="100" href="#">5</a>
													</li>
												</ul>
												<span class="result" id="stars6-tips"></span> <input
													type="hidden" id="stars6-input" name="f" value="" size="2" />
											</div>
											<!-- END  -->
										</s:if> <s:else>
											<!-- 货主的星级评分 -->
											<div class="shop-rating">
												<span class="title">货源信息准确性：</span>
												<ul class="rating-level" id="stars1">
													<li><a class="one-star" star:value="1" href="#">1</a>
													</li>
													<li><a class="two-stars" star:value="2" href="#">2</a>
													</li>
													<li><a class="three-stars" star:value="3" href="#">3</a>
													</li>
													<li><a class="four-stars" star:value="4" href="#">4</a>
													</li>
													<li><a class="five-stars" star:value="5" href="#">5</a>
													</li>
												</ul>
												<span class="result" id="stars1-tips"></span> <input
													type="hidden" id="stars1-input" name="a" value="" size="2" />
											</div>
											<div class="shop-rating">
												<span class="title">装车的及时性：</span>
												<ul class="rating-level" id="stars2">
													<li><a class="one-star" star:value="20" href="#">1</a>
													</li>
													<li><a class="two-stars" star:value="40" href="#">2</a>
													</li>
													<li><a class="three-stars" star:value="60" href="#">3</a>
													</li>
													<li><a class="four-stars" star:value="80" href="#">4</a>
													</li>
													<li><a class="five-stars" star:value="100" href="#">5</a>
													</li>
												</ul>
												<span class="result" id="stars2-tips"></span> <input
													type="hidden" id="stars2-input" name="b" value="" size="2" />
											</div>
											<div class="shop-rating">
												<span class="title">发货人的配合程度：</span>
												<ul class="rating-level" id="stars3">
													<li><a class="one-star" star:value="20" href="#">1</a>
													</li>
													<li><a class="two-stars" star:value="40" href="#">2</a>
													</li>
													<li><a class="three-stars" star:value="60" href="#">3</a>
													</li>
													<li><a class="four-stars" star:value="80" href="#">4</a>
													</li>
													<li><a class="five-stars" star:value="100" href="#">5</a>
													</li>
												</ul>
												<span class="result" id="stars3-tips"></span> <input
													type="hidden" id="stars3-input" name="c" value="" size="2" />
											</div>
											<div class="shop-rating">
												<span class="title">卸货的及时性：</span>
												<ul class="rating-level" id="stars4">
													<li><a class="one-star" star:value="20" href="#">1</a>
													</li>
													<li><a class="two-stars" star:value="40" href="#">2</a>
													</li>
													<li><a class="three-stars" star:value="60" href="#">3</a>
													</li>
													<li><a class="four-stars" star:value="80" href="#">4</a>
													</li>
													<li><a class="five-stars" star:value="100" href="#">5</a>
													</li>
												</ul>
												<span class="result" id="stars4-tips"></span> <input
													type="hidden" id="stars4-input" name="d" value="" size="2" />
											</div>
											<div class="shop-rating">
												<span class="title">收货人配合程度：</span>
												<ul class="rating-level" id="stars5">
													<li><a class="one-star" star:value="20" href="#">1</a>
													</li>
													<li><a class="two-stars" star:value="40" href="#">2</a>
													</li>
													<li><a class="three-stars" star:value="60" href="#">3</a>
													</li>
													<li><a class="four-stars" star:value="80" href="#">4</a>
													</li>
													<li><a class="five-stars" star:value="100" href="#">5</a>
													</li>
												</ul>
												<span class="result" id="stars5-tips"></span> <input
													type="hidden" id="stars5-input" name="e" value="" size="2" />
											</div>
											<div class="shop-rating">
												<span class="title">运费结算的及时性：</span>
												<ul class="rating-level" id="stars6">
													<li><a class="one-star" star:value="20" href="#">1</a>
													</li>
													<li><a class="two-stars" star:value="40" href="#">2</a>
													</li>
													<li><a class="three-stars" star:value="60" href="#">3</a>
													</li>
													<li><a class="four-stars" star:value="80" href="#">4</a>
													</li>
													<li><a class="five-stars" star:value="100" href="#">5</a>
													</li>
												</ul>
												<span class="result" id="stars6-tips"></span> <input
													type="hidden" id="stars6-input" name="f" value="" size="2" />
											</div>
										</s:else>
									</td>
								</tr>
							</table>

							<br> <br> <input type="button" name="submit_button"
								id="submit_button" value="评&nbsp;价" class="submit_button" />
						</form>
					</div>
				</div>
			</div>
			<!--中由-->
		</div>
	</div>
	<div>
		<jsp:include page="/footer.jsp"></jsp:include>
	</div>



	<script type="text/javascript" src="${pageContext.request.contextPath}/theme/js/stars.js">
		
	</script>
</body>
</html>